import React, { Component } from 'react'
import { Menu, Button } from 'antd'
import { NavLink } from 'react-router-dom'
import {
  AppstoreOutlined,
  MenuUnfoldOutlined,
  MenuFoldOutlined,
  PieChartOutlined,
  DesktopOutlined,
  ContainerOutlined,
  MailOutlined,
} from '@ant-design/icons';
import { getUrlIdentity } from '../../utils/api/api'

const { SubMenu } = Menu;
export default class NavLeft extends Component {
  state = {
    collapsed: false,
    leftUrl: []
  };
  toggleCollapsed = () => {
    this.setState({
      collapsed: !this.state.collapsed,
    });
  };

  componentDidMount() {
    this.identity()
  }

  // /api/identity
  async identity() {
    let data = await getUrlIdentity()
    console.log(data, 'data')
    this.setState({
      leftUrl: data.data
    })
  }

  render() {
    const { leftUrl } = this.state;
    return (
      <>
        <Menu
          defaultSelectedKeys={['1']}
          defaultOpenKeys={['sub1']}
          mode="inline"
          theme="dark"
        // inlineCollapsed={this.state.collapsed}
        >
          <SubMenu key="sub1" icon={<MailOutlined />} title="成绩管理系统">
            {
              leftUrl && leftUrl.map((item, index) => {
                return <Menu.Item key={index}>
                  <NavLink to={item.path}>{item.text}</NavLink>
                </Menu.Item>
              })
            }
          </SubMenu>
        </Menu>
      </>
    )
  }
}
